<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <title>Cart</title>
    </head>
    <link rel="stylesheet" href="css/style.css" type="text/css"/>
    <script type="text/javascript">
    function logout()
    {
        var response =confirm('Are you sure you wanna logout?');
    if(response)
        alert("Ban da logout thanh cong")
    }
    </script>
    <body>
        <h:form>
            <div id="container">

                <div id="banner">
                    <h1 >Shopping Cart</h1>
                     <p> <h:outputText value="Wellcom :#{beanProduct.us.userName}"/></p>
                </div>
                <div class="menu-nav">
                    <ul>
                        <li><a href="index.xhtml">Home</a></li>
                        <li><h:commandLink action="#{beanProduct.login}" value="Login" /></li>
                        <li><h:commandLink action="#{beanProduct.checkLogOut}" value="LogOut" onclick="logout()" /></li>
                        <li><h:commandLink action="#{beanProduct.showCart}" value="Show Cart" /></li>
                    </ul>
                </div>
                <div id="showcart">
                    <h:dataTable value="#{beanProduct.listCart}" var="pro" width="600" border="1" >
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="ProductID"/>
                            </f:facet>
                            <h:outputText value="#{pro.productID}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="ProductName"/>
                            </f:facet>
                            <h:outputText value="#{pro.productName}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Price"/>
                            </f:facet>
                            <h:outputText value="#{pro.price}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Quantity"/>
                            </f:facet>
                            <h:inputText  value="#{pro.quantity}" size="5" rendered="#{pro.editPro}"/>
                            <div align="center">
                                <h:outputText value="#{pro.quantity}"  rendered="#{not pro.editPro}"/>
                            </div>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Amount"/>
                            </f:facet>
                            <h:outputText value="#{pro.money.longValue()}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Edit"/>
                            </f:facet>
                            <h:commandLink value="Edit" action="#{beanProduct.editAction(pro)}" rendered="#{not pro.editPro}"/>
                        </h:column>

                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Delete"/>
                            </f:facet>
                            <h:commandLink value="Delete" action="#{beanProduct.removePro(pro.productID)}"/>
                        </h:column>

                        <f:facet name="footer">
                            <tr>
                                <td ></td>
                                <td colspan="2">
                                    <h:outputText value="Total Amount  : #{beanProduct.totalAmount.longValue()}"/>
                                </td>
                                <td colspan="2">
                                    <h:commandButton value="Save Changes" action="#{beanProduct.saveChange}"/>
                                </td>
                                <td colspan="2">
                                    <h:commandButton value="Delete All" action="#{beanProduct.DeleteAllCart}"/>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="7" align="center">
                                    <h:commandButton value="Check Out" action="#{beanProduct.CheckOut(pro)}"/>
                                </td>
                            </tr>
                        </f:facet>
                    </h:dataTable>
                    <h:outputText value="#{beanProduct.validateCartnull}"/>
                </div>
                <div id="footed"></div>
            </div>
        </h:form>
    </body>
</html>
